<%-- 
    Document   : index
    Created on : Jun 1, 2016, 2:06:23 PM
    Author     : niugao
--%>
<%@page contentType="text/html" pageEncoding="UTF-8" %>
<%@ include file="common.jsp" %>

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title><%=g_title%>
    </title>
    <link rel="stylesheet" type="text/css" href="/css/main.css">
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css">
    <script src="/js/jquery-1.12.4.min.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="/js/bootstrap.min.js"></script>
    <style>
        .container input {
            width: 100%;
        }

        .container div {
            margin: 5px 0px;
            outline: none;
        }
    </style>
    <script>
        function refreshCaptchaImg() {
            //从服务端重新下载验证码图片
            //给这个地正加参数纯为了强制刷新，否则由于src指向的url地址没变，
            //不会直正生刷新图片
            var now = new Date()
            $("#captcha").attr("src","/captcha_img?"+now.getTime());
        }
    </script>
</head>
<body>
    <img style="position:absolute;left:0px;top:0px;width:100%;height:100%;z-Index:-1;" src="../img/background.jpg" />

<!-- 很多页面都使用这个顶部栏，所以拿出来放到一个单独文件中 -->
<jsp:include page="componse/top_bar.jsp" flush="true"/>

<div style="text-align: center;">
    <div class="container" style="width: 400px;margin: 10px auto;text-align: left; ">
        <form method="POST">
            <div class="row">
                <div class="col-md-12">
                    <input type="text" placeholder="用户名" name="name" value="${value_name}"/>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <input type="password" placeholder="密码" name="password" value="${value_password}"/>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    <input type="text" placeholder="验证码" name="captcha"/>
                </div>
                <div class="col-md-6">
                    <%--当点击时重新下载新的验证码图片--%>
                    <img id="captcha" src="/captcha_img" onclick="refreshCaptchaImg()" />
                </div>
            </div>
            <div class="row" style="border-top:solid 1px;">
                <div class="col-sm-6">
                    <input type="submit" name="role" value="进入后台"/>
                </div>
                <div class="col-sm-1"></div>
                <div class="col-sm-5">
                    <input type="submit" name="role" value="员工登录"/>
                </div>
            </div>
        </form>
        <div class="row">
            <div class="col-sm-6"><a style="width:100%;" href="/account/sign_up">管理注册</a></div>
            <div class="col-sm-1"></div>
            <div class="col-sm-5" style="text-align: right;"><a style="width: 100%;" href="/Saccount/sign_up_student">员工注册</a>
            </div>
        </div>
        <div class="row" class="errobox" style="color: red">
            ${errMsg}
        </div>
    </div>
</div>
</body>
</html>
